
<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Machine Multi-Purpose HTML Template</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" media="all"/>
        <link href="css/themify-icons.css" rel="stylesheet" type="text/css" media="all"/>
        <link href="css/pe-icon-7-stroke.min.css" rel="stylesheet" type="text/css" media="all"/>
        <link href="css/flexslider.min.css" rel="stylesheet" type="text/css" media="all"/>
        <link href="css/lightbox.min.css" rel="stylesheet" type="text/css" media="all"/>
        <link href="css/theme.css" rel="stylesheet" type="text/css" media="all"/>
        <link href="css/custom.css" rel="stylesheet" type="text/css" media="all"/>
        <link href="http://fonts.googleapis.com/css?family=Roboto:100,400,300,700,400italic,500%7CMontserrat:400,700" rel="stylesheet" type="text/css">
    </head>
    <body>

				
		<div class="nav-container">
			<nav class="nav-1 relative-nav">
				<div class="container">
					<div class="row">
						<div class="col-xs-12">
							<a href="index.html" class="home-link">
								<img alt="Logo" class="logo" src="img/logo-square-light.png">
							</a>
							<ul class="menu">
								<li class="has-dropdown"><a href="#">Home</a>
									<ul class="subnav">
										<li><a href="index.html">Classic Home</a></li>
										<li><a href="home-2.html">Startup</a></li>
										<li><a href="home-3.html">Rustic</a></li>
										<li><a href="home-4.html">Agency</a></li>
										<li><a href="home-5.html">One Page</a></li>
										<li><a href="home-6.html">Personal</a></li>
										<li><a href="home-7.html">Landing</a></li>
									</ul>
								</li>
								<li class="has-dropdown"><a href="#">Pages</a>
									<ul class="subnav">
										<li class="has-dropdown-2"><a href="#">About</a>
											<ul class="subnav-level-2">
												<li><a href="about-1.html">About 1</a></li>
												<li><a href="about-2.html">About 2</a></li>
												<li><a href="about-3.html">About 3</a></li>
											</ul>
										</li>
										<li class="has-dropdown-2"><a href="#">Services</a>
											<ul class="subnav-level-2">
												<li><a href="services-1.html">Services 1</a></li>
												<li><a href="services-2.html">Services 2</a></li>
												<li><a href="services-3.html">Services 3</a></li>
											</ul>
										</li>
										<li class="has-dropdown-2"><a href="#">Coming Soon</a>
											<ul class="subnav-level-2">
												<li><a href="coming-soon-1.html">Coming Soon 1</a></li>
												<li><a href="coming-soon-2.html">Coming Soon 2</a></li>
											</ul>
										</li>
										<li><a href="404.html">404 Error</a></li>
									</ul>
								</li>
								<li class="has-dropdown"><a href="#">Blog</a>
									<ul class="subnav">
										<li class="has-dropdown-2"><a href="#">Post Pages</a>
											<ul class="subnav-level-2">
												<li><a href="blog-1.html">Grid</a></li>
												<li><a href="blog-2.html">Grid Sidebar</a></li>
												<li><a href="blog-3.html">Image</a></li>
												<li><a href="blog-4.html">Image Sidebar</a></li>
											</ul>
										</li>
										<li class="has-dropdown-2"><a href="#">Articles</a>
											<ul class="subnav-level-2">
												<li><a href="article-1.html">Article</a></li>
												<li><a href="article-2.html">Article Sidebar</a></li>
											</ul>
										</li>
									</ul>
								</li>
								<li class="has-dropdown"><a href="#">Work</a>
									<ul class="subnav">
										<li class="has-dropdown-2"><a href="#">Projects</a>
											<ul class="subnav-level-2">
												<li><a href="work-1.html">Filter Grid</a></li>
												<li><a href="work-2.html">Large Grid</a></li>
											</ul>
										</li>
										<li><a href="work-single-1.html">Single</a></li>
									</ul>
								</li>
								<li class="has-dropdown"><a href="#">Shop</a>
									<ul class="subnav">
										<li><a href="shop-1.html">Products Grid</a></li>
										<li><a href="product-1.html">Single Product</a></li>
									</ul>
								</li>
								<li class="has-dropdown"><a href="#">Contact</a>
									<ul class="subnav">
										<li><a href="contact-1.html">Project Planner</a></li>
										<li><a href="contact-2.html">Map & Instagram</a></li>
										<li><a href="contact-3.html">Simple Form</a></li>
									</ul>
								</li>
							</ul>
							
							<ul class="social-links">
								<li><a href="#"><i class="ti ti-twitter-alt"></i></a></li>
								<li><a href="#"><i class="icon ti ti-vimeo-alt"></i></a></li>
								<li><a href="#"><i class="icon ti ti-dribbble"></i></a></li>
							</ul>
						
							<div class="nav-functions">
						
								<div class="search-bar">
									<form class="search">
										<input type="text" placeholder="" name="search">
										<input type="submit" value="">
										<i class="pe-7s-search"></i>
									</form>
								</div>
							</div>
						</div>
					</div><!--end of row-->
				</div><!--end of container-->
			
				<div class="mobile-toggle">
					<div class="bar-1"></div>
					<div class="bar-2"></div>
				</div>
			</nav>
		</div>
		
		<div class="main-container">
					
			<section class="promo-1">
				<div class="promo-image-holder">
					<div class="background-image-holder">
						<img alt="Slide Background" class="background-image" src="img/divider1.jpg">
					</div>
				</div>
			
				<div class="container">
					<div class="row">
						<div class="col-md-10 col-md-offset-1">
							<div class="col-sm-7 left-content">
								<div class="vertical-align">
									<h4>Let's give that dusty old<br> business some shine</h4>
									<p class="lead">
										Nam libero tempore, cum soluta nobis est eligendi optio<br> cumque nihil impedit quo minus id quod maxime .
									</p>
								</div>
							</div>
						
							<div class="col-sm-5 right-content">
								<div class="vertical-align">
									<span class="text-white title">Questions or queries?</span>
									<span class="sub">Get in touch immediately then man</span>
									<a class="btn btn-white" href="#">Start The Convo</a>
								</div>
							</div>
						</div>
					</div><!--end of row-->
				</div><!--end of container-->
			</section>
			
			<section class="services-combo-1">
		
				<i class="jumbo pe-7s-global"></i>
		
				<div class="container">
					<div class="row">
						<div class="col-md-6">
							<p class="text-white super-lead">
								Machine steps in a bold new direction for HTML templates, offering you complete creative control.
							</p>
							<p class="lead text-white">
								Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam,
							</p>
							<a class="btn btn-filled" href="#">Learn More</a>
						</div>
						
						<div class="col-md-6 col-sm-12">
							<div class="side-icon-feature">
								<div class="icon">
									<i class="pe-7s-display1"></i>
								</div>
								<div class="content">
									<h5 class="text-white">Engaging Layouts</h5>
									<p class="text-white">
										Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
									</p>
								</div>
							</div><!--end of side icon feature-->
						
							<div class="side-icon-feature">
								<div class="icon">
									<i class="pe-7s-help2"></i>
								</div>
								<div class="content">
									<h5 class="text-white">Premium Support</h5>
									<p class="text-white">
										Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
									</p>
								</div>
							</div><!--end of side icon feature-->
						
							<div class="side-icon-feature">
								<div class="icon">
									<i class="pe-7s-keypad"></i>
								</div>
								<div class="content">
									<h5 class="text-white">Multiple Styles</h5>
									<p class="text-white">
										Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
									</p>
								</div>
							</div><!--end of side icon feature-->
						</div>
					</div><!--end of row-->
				</div><!--end of container-->
			</section>
			
			<section class="narrow-features">
				<div class="container">
					<div class="row">
						<div class="col-sm-4">
							<div class="text-block">
								<div class="detail-line"></div>
								<h5>Unmatched Expertise</h5>
								<h4>Vast experience meets<br> ambitious vision.</h4>
							</div>
						</div>
					
						<div class="col-sm-8">
							<div class="col-md-6 col-sm-12">
								<div class="narrow-feature">
									<i class="icon pe-7s-compass"></i>
									<div class="content">
										<h5>Slick &amp; Extensible</h5>
										<p>
											Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.
										</p>
									</div>
								</div>
							</div><!--end of inidividual narrow feature-->
						
							<div class="col-md-6 col-sm-12">
								<div class="narrow-feature">
									<i class="icon pe-7s-target"></i>
									<div class="content">
										<h5>On Trend Design</h5>
										<p>
											Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.
										</p>
									</div>
								</div>
							</div><!--end of inidividual narrow feature-->
						
							<div class="col-md-6 col-sm-12">
								<div class="narrow-feature">
									<i class="icon pe-7s-paint"></i>
									<div class="content">
										<h5>Tons of Options</h5>
										<p>
											Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.
										</p>
									</div>
								</div>
							</div><!--end of inidividual narrow feature-->
						
							<div class="col-md-6 col-sm-12">
								<div class="narrow-feature">
									<i class="icon pe-7s-help2"></i>
									<div class="content">
										<h5>Dedicated Support Forum</h5>
										<p>
											Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna.
										</p>
									</div>
								</div>
							</div><!--end of inidividual narrow feature-->
						</div>
					</div><!--end of row-->
				</div><!--end of container-->
			</section>
			
			<section class="info-panels">
				<div class="container">
					<div class="row">
						<div class="col-sm-4">
							<div class="info-panel">
								<div class="title">
									<h4>Clear Direction</h4>
								</div>
								<div class="body">
									<p>
										Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
									</p>
									<ul class="arrow-list">
										<li><a href="#">Web Design</a></li>
										<li><a href="#">Web Applications</a></li>
									</ul>
								</div>
							</div>
						</div>
					
						<div class="col-sm-4">
							<div class="info-panel">
								<div class="title">
									<h4>Digestible Information</h4>
								</div>
								<div class="body">
									<p>
										Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
									</p>
									<ul class="arrow-list">
										<li><a href="#">Brand Strategy</a></li>
										<li><a href="#">Print Marketing</a></li>
									</ul>
								</div>
							</div>
						</div>
					
						<div class="col-sm-4">
							<div class="info-panel">
								<div class="title">
									<h4>Useful Elements</h4>
								</div>
								<div class="body">
									<p>
										Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
									</p>
									<ul class="arrow-list">
										<li><a href="#">Web Design</a></li>
										<li><a href="#">Web Applications</a></li>
									</ul>
								</div>
							</div>
						</div>
					</div><!--end of row-->
				</div><!--end of container-->
			</section>
			<footer class="footer-6">
				<div class="container">
					<div class="row">
						<div class="col-md-3 col-md-offset-1 col-sm-6">
							<a href="#">
								<img class="logo" alt="logo" src="img/logo-square-light.png">
							</a>
							<p>
								300 Collins St.<br> 
								Suite 2A<br>  
								Melbourne, 3000
							</p>
							<p>
								P: +6148 3847 382<br>
								E: hello@machine.net
							</p>
						</div>
					
						<div class="col-md-4 col-sm-6">
							<h5>Twitter</h5>
							<div class="twitter-feed">
								<div class="tweets-feed" data-widget-id="492085717044981760">
							
								</div>
							</div>
						</div>
					
						<div class="col-md-2 col-md-offset-1 col-sm-12">
							<h5>Navigate</h5>
							<ul class="link-list">
								<li><a href="#">About Us</a></li>
								<li><a href="#">Services</a></li>
								<li><a href="#">Our Work</a></li>
								<li><a href="#">Journal</a></li>
								<li><a href="#">Contact</a></li>
							</ul>
						</div>
				
					</div><!--end of row-->
				
					<div class="row">
						<div class="col-sm-12">
							<div class="footer-lower">
								<span>© Copyright 2014 Medium Rare, All Rights Reserved</span>
								<ul class="social-links">
									<li><a href="#"><i class="icon ti ti-twitter-alt"></i></a></li>
									<li><a href="#"><i class="icon ti ti-vimeo-alt"></i></a></li>
									<li><a href="#"><i class="icon ti ti-dribbble"></i></a></li>
	
								</ul>
							</div>
						</div>
					</div><!--end of row-->
				
				</div><!--end of container-->	
			</footer>
		</div>
		
				
		<script src="js/jquery.min.js"></script>


        <script src="js/bootstrap.min.js"></script>
        <script src="js/skrollr.min.js"></script>
        <script src="js/flexslider.min.js"></script>
        <script src="js/lightbox.min.js"></script>
        <script src="js/twitterfetcher.min.js"></script>
        <script src="js/spectragram.min.js"></script>
        <script src="js/smooth-scroll.min.js"></script>
        <script src="js/jquery.plugin.min.js"></script>
        <script src="js/countdown.min.js"></script>
        <script src="js/placeholders.min.js"></script>
        <script src="js/parallax.js"></script>
    	<script src="js/scripts.js"></script>
    </body>
</html>

				